<template>
	<view>
		<view class="banner"></view>
		<view class="form">
			<view class="text">定期体检，关注健康</view>
			<uni-easyinput v-model="idNumber" placeholder="请输入身份证号码"></uni-easyinput>
			<button type="default" class="nextStep" @tap="toNext">下一步</button>
		</view>
	</view>
</template>

<script>
import { ref } from 'vue'
import { bookRecord } from '@/api/book.js'
import { checkID } from '@/utils/checkID.js'
export default {
	setup() {
		const idNumber = ref('')
		const toNext = async() => {
			if(!checkID(idNumber.value)) {
				uni.showToast({
					title:'请输入正确的身份证号码'
				})
				return
			}
			const data = await bookRecord(idNumber.value)
			if(data.code == 200){
				uni.navigateTo({
					url: `/pages/personBook/perBookList?idNumber=${idNumber.value}`
				})
			}else{
				uni.showToast({
					title:data.msg
				})
				uni.navigateTo({
					url: `/pages/personBook/perBook?idNumber=${idNumber.value}`
				})
			}
		}
		return{
			idNumber,
			toNext
		}
	}
}
</script>

<style lang="scss" scoped>
.banner{
	height: 500upx;
	// background-image: url('../../static/images/perQuery-banner.png');
	background-image: url("https://s1.ax1x.com/2022/05/20/OqzVht.png");
	background-size: 100%;
}
.form{
	height: 560upx;
	width: 100%;
	padding: 100upx 100upx 100upx;
	// background-image: url('../../static/images/perQuery-bgc.png');
	background-image: url("https://s1.ax1x.com/2022/05/20/OqzrNR.png");
	background-size: 100%;
	position: absolute;
	top: 23%;
	left: 0%;
	.text{
		text-align: center;
		font-size: 28upx;
		color: #409eff;
		margin-bottom: 60upx;
	}
}
.nextStep{
	width: 50%;
	height: 70upx;
	line-height: 70upx;
	font-size: 28upx;
	color: #fff;
	margin-top: 60upx;
	background-color: #409eff;
}
</style>